<head>

    <link href="${ctx}/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="${ctx}/font-awesome/3.0.0/css/font-awesome.min.css" rel="stylesheet">
    <link href="${ctx}/css/index.css" rel="stylesheet">
    <link href="${ctx}/bootstrap-table/1.12.0/bootstrap-table.min.css" rel="stylesheet">
    <script src="${ctx}/jquery/2.1.4/jquery.min.js"></script>
    <script src="${ctx}/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="${ctx}/bootstrap-table/1.12.0/bootstrap-table.min.js"></script>
    <script src="${ctx}/bootstrap-table/1.12.0/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="${ctx}/bootstrap-table/1.12.0/extensions/export/bootstrap-table-export.min.js"></script>
    <script src="${ctx}/js/extends.js"></script>
    <script src="${ctx}/layui/layui.all.js"></script>
    <script src="${ctx}/js/util.js"></script>
    <link href="${ctx}/layui/css/layui.css" rel="stylesheet">
    <style>
        .btn {
            font-size: 12px;
        }

        .line_item {
            display: inline-block;
            height: 43px;
            margin-right: 10px;
        }

        .line_lab {
            padding: 0;
            line-height: 38px;
            width: 160px;
            margin-right: 10px;
            float: left;
        }

        .line_block {
            width: 300px;
            margin-left: 0;
            float: left;
        }

        .line_block input {
            padding-right: 10px;
        }

        .data_table {
            padding: 0 25px;
        }

        .layui-form-checkbox[lay-skin=primary] i {
            top: 5px;
        }

        .intro_lab {
            display: flex;
            padding-left: 135px;
            margin-bottom: 10px;
        }

        .intro_lab span {
            display: block;
            width: 99px;
            color: #5FB878;
        }
    </style>
    <style>
        .btn {
            font-size: 12px;
        }

        .line_item {
            display: inline-block;
            height: 43px;
            margin-right: 10px;
        }

        .line_lab {
            padding: 0;
            line-height: 38px;
            width: 160px;
            margin-right: 10px;
            float: left;
        }

        .line_block {
            width: 300px;
            margin-left: 0;
            float: left;
        }

        .line_block input {
            padding-right: 10px;
        }

        .data_table {
            padding: 0 25px;
        }

        .layui-form-checkbox[lay-skin=primary] i {
            top: 5px;
        }
    </style>
</head>
<body>
<br><br>

<form class="layui-form" action="" lay-filter="item" style="width: 900px;margin: 0 auto;">
    <input type="button" class="layui-btn"
           style="width: 6%;float: left;padding: 0px 8px;" value="添加" onclick="addRecord()">
    <input type="hidden" name="id" readonly value="${item.id!''}">
    <input type="hidden" name="appid" readonly value="${item.appid!''}">

    <div class="intro_lab">
        <span>数据源</span>
        <span>录制日期</span>
        <span>渠道</span>
        <span>展示</span>
        <span>点击</span>
        <span>收益</span>
    </div>
    <div id="box">
        <div class="layui-form-item line_item payScore" id="boxItem0">
            <label class="layui-form-label line_lab"></label>
            <div class="layui-input-block line_block" style="width: 700px;">
                <div >
                    <input type="text" name="sdkKey" placeholder="数据源" autocomplete="off" class="layui-input"
                           style="width: 11%;float: left;" value="">
                    <input type="text" id="time0" name="time" placeholder="录制日期" autocomplete="off" class="layui-input"
                           style="width: 16%;float: left;" value="">
                    <input type="text" name="appStore" placeholder="渠道" autocomplete="off" class="layui-input"
                           style="width: 11%;float: left;" value="">
                    <input type="text" name="show" placeholder="展示" autocomplete="off" class="layui-input"
                           style="width: 16%;float: left;" value="">
                    <input type="text" name="click" placeholder="点击" autocomplete="off" class="layui-input"
                           style="width: 16%;float: left;" value="">
                    <input type="text" name="award" placeholder="收益" autocomplete="off" class="layui-input"
                           style="width: 16%;float: left;" value="">
                </div>
            </div>
        </div>

    </div>



    <#--<div class="layui-form-item line_item" >
        <label class="layui-form-label line_lab"><span class="c-red">*</span>数据源</label>
        <div class="layui-input-block line_block" >
            <select name="sdkKey" id="sdkKey" lay-verify="" style="width: 300px">
                <#list ite as list>
                    <option value="${list.sdkKey}" <#if item.sdkKey??><#if list.sdkKey==item.sdkKey>selected</#if></#if>>${list.taskName}</option>
                </#list>
            </select>
        </div>
    </div>

    <div class="layui-form-item line_item" >
        <label class="layui-form-label line_lab"><span class="c-red">*</span>录入日期</label>
        <div class="layui-input-block line_block" >
            <input type="text" class="layui-input" id="time" name="time" placeholder="请选择录入日期" value="${item.time!''}">
        </div>
    </div>

    <div class="layui-form-item line_item" >
        <label class="layui-form-label line_lab"><span class="c-red">*</span>展示</label>
        <div class="layui-input-block line_block" >
            <input type="text" name="show"
                   lay-verify="required" placeholder="展示"
                   autocomplete="off" class="layui-input" value="${item.show!''}">
        </div>
    </div>

    <div class="layui-form-item line_item" >
        <label class="layui-form-label line_lab"><span class="c-red">*</span>点击</label>
        <div class="layui-input-block line_block" >
            <input type="text" name="click"
                   lay-verify="required" placeholder="点击"
                   autocomplete="off" class="layui-input" value="${item.click!''}">
        </div>
    </div>

    <div class="layui-form-item line_item" >
        <label class="layui-form-label line_lab"><span class="c-red">*</span>收益</label>
        <div class="layui-input-block line_block" >
            <input type="text" name="award"
                   lay-verify="required" placeholder="收益"
                   autocomplete="off" class="layui-input" value="${item.award!''}">
        </div>
    </div>-->




    <div class="layui-form-item">
        <div class="layui-input-block" style="text-align: center;margin: 0">
            <button class="layui-btn" lay-submit lay-filter="formUpdate">保存</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>


<script>

    var index = 0;
    var records = [];

    //删除记录
    function deleteRecord(id){
        $("#"+id).remove();
    }

    //添加记录
    function addRecord(){
        index= index+1;
        var text = "        <div class=\"layui-form-item line_item payScore\" id=\"boxItem"+index+"\">\n" +
            "            <label class=\"layui-form-label line_lab\"></label>\n" +
            "            <div class=\"layui-input-block line_block\" style=\"width: 700px;\">\n" +
            "                <div>\n" +
            "                    <input type=\"text\" name=\"sdkKey\" placeholder=\"数据源\" autocomplete=\"off\" class=\"layui-input\"\n" +
            "                           style=\"width: 11%;float: left;\" value=\"\">\n" +
            "                    <input type=\"text\" id=\"time"+index+"\" name=\"time\" placeholder=\"录制日期\" autocomplete=\"off\" class=\"layui-input\"\n" +
            "                           style=\"width: 16%;float: left;\" value=\"\">\n" +
            "                    <input type=\"text\" name=\"appStore\" placeholder=\"渠道\" autocomplete=\"off\" class=\"layui-input\"\n" +
            "                           style=\"width: 11%;float: left;\" value=\"\">\n" +
            "                    <input type=\"text\" name=\"show\" placeholder=\"展示\" autocomplete=\"off\" class=\"layui-input\"\n" +
            "                           style=\"width: 16%;float: left;\" value=\"\">\n" +
            "                    <input type=\"text\" name=\"click\" placeholder=\"点击\" autocomplete=\"off\" class=\"layui-input\"\n" +
            "                           style=\"width: 16%;float: left;\" value=\"\">\n" +
            "                    <input type=\"text\" name=\"award\" placeholder=\"收益\" autocomplete=\"off\" class=\"layui-input\"\n" +
            "                           style=\"width: 16%;float: left;\" value=\"\">\n" +
            "                    <input type=\"button\" class=\"layui-btn\"\n" +
            "                           style=\"width: 6%;float: left;padding: 0px 8px;\" value=\"删除\" onclick=\"deleteRecord('boxItem"+index+"')\">\n" +
            "                </div>\n" +
            "\n" +
            "            </div>\n" +
            "        </div>";
        $("#box").append(text);

        layui.use('laydate', function () {
            var laydate = layui.laydate;
            laydate.render({
                elem: '#time'+index

                , type: 'datetime'
                , format: 'yyyyMMdd'
            });
        });
    }

    $(document).ready(function () {
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            laydate.render({
                elem: '#time0'

                , type: 'datetime'
                , format: 'yyyyMMdd'
            });
        });

        layui.use('form', function () {

            var form = layui.form;
            form.render();
            form.on('submit(formUpdate)', function (data) {
                records = [];
                var list = $(".line_block div");
                for(var i=0;i<list.length;i++){
                    var item = list[i];
                    var inputList = $(item).children("input.layui-input");
                    var record = {};
                    for(var j=0;j<inputList.length;j++){
                        var inputItem = inputList[j];
                        record[$(inputItem)[0].name] = $(inputItem)[0].value;
                    }
                    records.push(record);
                }

                console.log(records);

                $.ajax({
                    url: "/sys/taskworthrecord/saveEdit",    //请求的url地址
                    dataType: "json",   //返回格式为json
                    async: true,//请求是否异步，默认为异步，这也是ajax重要特性
                    data: {records:JSON.stringify(records)},    //参数值,键值对
                    type: "post",   //请求方式
                    beforeSend: function () {
                        //请求前的处理
                    },
                    success: function (req) {
                        //请求成功时处理
                        if (req.success) {
                            parent.showmsg(req.message);
                            parent.search();
                            layer.msg(req.message)
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            parent.layer.close(index); //再执行关闭

                        } else {
                            layer.msg(req.message)
                        }
                    },
                    complete: function () {
                        //请求完成的处理
                    },
                    error: function () {
                        //请求出错处理
                        layer.msg("请重试！若在失败请联系管理员")
                    }
                });

                return false;
            });
        });
    });



</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>